<!-- 一周项目一览表 -->
<template>
	<view>
		<cu-custom bgColor="bg-blue2" :isBack="true" @back="backedPage"><block slot="backText">返回</block><block slot="content">客户到货量汇总表</block></cu-custom>
		<view v-if="false">
			<form>
				<view class="cu-form-group">
					<view class="title">开始日期:</view>
					<picker mode="date" :value="startDate"  @change="StartDateChange">
						<view class="picker">
							{{startDate}}
						</view>
					</picker>
					<view class="title">结束日期:</view>
					<picker mode="date" :value="endDate"  @change="EndDateChange">
						<view class="picker">
							{{endDate}}
						</view>
					</picker>
				</view>
				<view class="cu-form-group">
					<view class="title">单据类型:</view>
					<input name="input" v-model="billType"></input>
					<view class="title">作业班组:</view>
					<input name="input" v-model="workGroupName"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">作业人员:</view>
					<input name="input" v-model="workerName"></input>
					<view class="title">作业类型:</view>
					<input name="input" v-model="workType"></input>
				</view>
				<view class="cu-form-group">
					<view class="title"></view>
					<input name="input" disabled="disabled"></input>
					<button class='cu-btn bg-green shadow' @tap="queryClick()">查询</button>
				</view>
			</form>
		</view>
		<view class="">
			<!-- <refresh ref="refresh" @refresh='onRefresh'> -->
				<z-table :tableData='tableData' :columns='columns' :tableHeight="1200"></z-table>
			<!-- </refresh> -->
		</view>
	</view>
</template>

<script>
	import { formatDateDay } from '@/utils/datetime.js'
	import { getDateRange } from '@/utils/index.js'
	import zTable from "@/components/z-table/z-table.vue"
	import refresh from "@/components/refresh/refresh.vue"
	var _self
	var canvaPie=null
	export default {
		components: {
			zTable,
			refresh
		},
		data() {
			return {
				tableData:[],
				columns:[
					// { title:'序号',key:'index',width: 80 },
					{ title:'客户名称',key:'clientName',width: 400 },
					{ title:'年度累计到货量',key:'yearWeight',width: 210  },
					{ title:'本月累计到货量',key:'monthWeight',width: 210  },
					{ title:'当日累计到货量',key:'dayWeight',width: 210  }
				],
				startDate: '2018-12-25',
				endDate: '2018-12-25',
				billType:'',
				workGroupName:'',
				workerName:'',
				workType:'',
				pageIndex: 1,
				pageSize: 10
			}
		},
		onLoad() {
			var date = new Date()
			var dateRange = getDateRange(date, 1, true)
			this.startDate = dateRange[0]
			this.endDate = dateRange[1]
			this.onRefresh()
		},
		methods: {
			StartDateChange(e) {
				this.startDate = e.detail.value
			},
			EndDateChange(e) {
				this.endDate = e.detail.value
			},
			onRefresh() {
				uni.showLoading({
					title: '正在查询数据...'
				})
				this.$minApi.getClientArrivalQuantity().then(res => {
				
					const data = res
					if (data) {
						
						this.tableData = data
						
						// let totalPage = data.totalCount
						// let hasNext = this.tableData.length < totalPage
						
						// if (data.list) {
						// 	data.list.forEach( (item, index) => {
						// 		item.index = (index +1)
						// 		item.dat = formatDateDay(item.dat)
						// 	})
						// }
						
					// 	if (this.pageIndex === 1) this.tableData = [] //如果是第一页需手动置空列表
					// 	this.tableData = this.tableData.concat(data.list) //追加新数据
					
					// 	this.pageIndex =  1	// 页码, 默认从1开始			
						
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => {
					// this.$refs.refresh.endAfter() //通知下拉刷新组件刷新已经完成
					// 隐藏加载状态
					uni.hideLoading()
				})
				
			},
			queryClick() {
				this.pageIndex = 1
				this.onRefresh()
			},
			backedPage() {
				uni.redirectTo({
					url: `/pages/analysis/index`
				})
			}
		}
	}
</script>

<style>
	/* .project-list+.project-list {
		margin-top: 2rpx !important;
	} */
	/*样式的width和height一定要与定义的cWidth和cHeight相对应*/
	.qiun-charts {
		width: 750upx;
		height: 500upx;
		background-color: #FFFFFF;
	}
	
	.charts {
		width: 750upx;
		height: 500upx;
		background-color: #FFFFFF;
	}
	.container {
		min-height: 400px !important;
	}
</style>
